$(function(){
	chartLine("chart1");
	chartBar("chart2")
})
//折线图与柱形图
function chartLine(id){
	var echartWidth = $(window).width() * 0.256;
	var echartHeight = $(window).height() * 0.168;
	var legend = ['投产','产值'];
	var xAxisData = ['2016年','2017年','2018年'];
	var data1 = [123, 131, 165];
	var data2 = [247, 215, 211];
	
	var myChart = echarts.init(document.getElementById(id));
	/*根据浏览器宽、高设置echarts 宽、高*/
	myChart.resize({
	    width: echartWidth,
	    height: echartHeight
	});
	
	options = {
	    tooltip : {
	        trigger: 'axis'
	    },
	    color:['#4c8caa', '#f19738'],
	    legend: {
	    	icon: 'rect',
	    	itemWidth: 14,
	    	itemHeight: 5,
	    	itemGap: 13,
	    	y: '2%',
	    	x2: '5%',
	        data:legend,
	        textStyle:{
	        	color: '#fff'
	        }
	    },
	    xAxis : [
	        {
	            type : 'category',
	            boundaryGap : true,//折线两侧留白的空间
	            axisLine : {
	            	lineStyle:{
	            		color: '#fff'
	            	}	
	            },
	            data : xAxisData
	        }
	    ],
	    yAxis : [
	        {
	            type : 'value',
	            name: '单位：万',
	            nameGap: -8,
	            nameTextStyle:{
	            	padding: [0,0,0,60]
	            },
	            max : 300,
	            axisLine : {
	            	lineStyle:{
	            		color: '#fff'
	            	}
	            },
		        splitLine: {
		            show: false
		        }
	        }
	    ],
	    grid: {
	    	top: '10%',
	    	left: '10%',
	    	right: '10%',
	    	bottom: '20%'
	    },
	    series : [
	        {
	            name:'投产',
	            type:'line',
	            data : data1
	        },
	        {
	            name:'产值',
	            type:'line',
	            data : data2
	        }
	    ]
	}
	myChart.setOption(options);
}
function chartBar(id){
	var echartWidth = $(window).width() * 0.256;
	var echartHeight = $(window).height() * 0.168;
	var xAxisData = ['2016年','2017年','2018年'];
	
	var myChart = echarts.init(document.getElementById(id));
	/*根据浏览器宽、高设置echarts 宽、高*/
	myChart.resize({
	    width: echartWidth,
	    height: echartHeight
	});
	options = {
	    tooltip : {
	        trigger: 'axis'
	    },
	    color:["#348ea9","#54ba9b","#f48b38","#35acfe"],
	    xAxis : [
	        {
	            type : 'category',
	            axisLine : {
	            	lineStyle:{
	            		color: '#fff'
	            	}
	            },
	            data : xAxisData
	        }
	    ],
	    yAxis : [
	        {
	            type : 'value',
	            name: '单位：万',
	            nameGap: -8,
	            nameTextStyle:{
	            	padding: [0,0,0,60]
	            },
	            splitNumber: 3,
	            max:200,
	            axisLine : {
	            	lineStyle:{
	            		color: '#fff'
	            	}
	            },
		        splitLine: {
		            show: false
		        }
	        }
	    ],
	    grid: {
	    	top: '15%',
	    	left: '10%',
	    	right: '10%',
	    	bottom: '20%'
	    },
	    series : [
	        {
	            type:'bar',
	            barWidth:'35',
	            "itemStyle": {
	                "normal": {
	                    "color": "#ffffff",
	                    "label": {
	                        "show": true,
	                        "textStyle": {
	                            "color": "#fff"
	                        },
	                        "position": "top",
	                        formatter: function(p) {
	                            return p.value > 0 ? (p.value) : '';
	                        }
	                    }
	                }
	            },
	            data:[
	            	{
				        value:'102.0',            
				        itemStyle:{
				            color : '#348ea9'
				        }
				    },
				    {
				        value:'134.9',            
				        itemStyle:{
				            color : '#54ba9b'
				        }
				    },
				    {
				        value:'127.0',            
				        itemStyle:{
				            color : '#f48b38'
				        }
				    }/*,
				    {
				        value:'23.2',            
				        itemStyle:{
				            color : '#35acfe'
				        }
				    }*/
	            ]
	        },
	    ]
	}
	myChart.setOption(options);
}